function SSCAnimate(option) {
  let defaultOption = {
    el: null, // 一个宽高固定的容器
    nums: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10], // 候选数字
    onEnd(num) { // 开奖结束回调
      console.log(num);
    },
  };
  option = { ...defaultOption, ...option };

  this.el = typeof option.el == 'string' ? document.querySelector(option.el) : option.el;
  this.nums = option.nums;
  this.curNum = this.getRandomNum();
  this.onEnd = option.onEnd;
  this.height = this.el.offsetHeight;
  this.running = false;
  this.render();
}

Object.assign(SSCAnimate.prototype, {
  getRandomNum() { // 随机获取一个与当前num不同的num
    let l = this.nums.length;
    let num = this.nums[Math.floor(Math.random() * l)];
    if (num == this.curNum) return this.getRandomNum();
    return num;
  },
  render() {
    this.el.innerHTML = this.curNum;
  },
  start(option) {
    if (this.running) return;
    this.running = true;
    let defaultOption = {
      outMS: 50, // 每次数字中间落到底部的动画时长
      inMS: 50, // 每次数字从上面落入中间的动画时长
      times: 40, // 数字变化的次数
    };
    option = { ...defaultOption, ...option };
    let count = 0, { outMS, inMS, times } = option;
    let animate = () => {
      Object.assign(this.el.style, {
        lineHeight: `${this.height * 2}px`,
        transition: `line-height ${outMS}ms linear`
      });
      setTimeout(() => {
        Object.assign(this.el.style, {
          lineHeight: '0px',
          transition: 'none',
        });
        setTimeout(() => {
          this.curNum = this.getRandomNum();
          this.render();
          Object.assign(this.el.style, {
            lineHeight: `${this.height}px`,
            transition: `line-height ${inMS}ms linear`,
          });
          setTimeout(() => {
            if (++count == times) {
              this.onEnd(this.curNum);
              this.running = false;
            } else {
              animate.call(this);
            }
          }, inMS);
        }, 20);
      }, outMS);
    };
    animate();
  },
});